<!DOCTYPE html>
<html>
	<head>
		<meta charset="utf-8" />
		<title></title>
	</head>
	<body>
		<canvas id="canvas" style="border: 1px solid red;"></canvas>
		<script>
			window.onload = function(){
				var canvas = document.getElementById("canvas");
				var cxt = canvas.getContext("2d");
				canvas.width =400;
				canvas.height =300;
				for(var i=0;i<5;i++){
					for(var j=0;j<6;j++){
						cxt.fillStyle = "rgb("+(255-100*i)+","+(255-100*j)+",100)";
						cxt.fillRect(25*i,25*j,25,25);
					}
				}
			}
		</script>
	</body>
</html>
